<template>
	<div class="api" id="api">
		<div class="st_t1">
			我的API
		</div>
		<div class="api_int">
			<p>链行为您提供了强大的API，您可以根据自身需求建立不同权限的API，并利用自动交易或者提现。</p>
			<p>API的交易权限让您可以快速的获取当前市场最新行情及时的下单交易、查询自己可用和冻结金额、查询自己当前</p>
			<p>尚未成交的挂单、买进或卖出、撤单。</p>
			<p>每个普通用户最多只能创建10个秘钥对。</p>
			<div class="btn_api">
				<button>创建API</button>
			</div>
		</div>
		<div class="api_table">
			<p class="api_title">备注名称</p>
			<div class="table_title">
				<div class="title_p">已申请API接口</div>
			</div>
			<table class="table">
				<thead>
					<tr>
						<td>APIKey</td>
						<td>权限</td>
						<td>操作</td>
					</tr>
				</thead>
			</table>
			<div class="null_table">
				暂未创建API
			</div>
			<div class="see_detail">
				详情请见<span>API文档</span>
			</div>
		</div>
	</div>
</template>

<script>
	export default {
		name: 'api',
		computed: {
		},
		data() {
			return {
				title: '',
			}
		}, //定义变量
		components: {
		}, //注册组件
		methods: {//方法都在这里
		},
		mounted() {
			var that = this;
			//获取banner
		},
	}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang="scss">
	.api {
		text-align: left;
		.st_t1 {
			padding: 15px 20px;
			background: #f4f4f4;
			width: 100%;
			text-align: left;
			font-size: 24px;
		}
		.api_int{
			padding:15px 0px 0px 30px;
			margin-top:30px;
			background:#EFEFEF;
			font-size:12px;
			line-height: 20px;
			.btn_api{
				width:100%;
				text-align: right;
				button{
					width:105px;
					height:30px;
					border:0;
					background:#007AFF;
					color:#fff;
					border-radius:none;
				}
			}
		}
		.api_table{
			.api_title{
				font-size:12px;
				color:#A3A1A1;
				padding-left:20px;
				margin:10px 0;
			}
			.table_title{
				width:100%;
				border-bottom:#007AFF solid 10px;
				.title_p{
					width:225px;
					height:30px;
					border:0;
					background:#007AFF;
					color:#fff;
					border-radius:0;
					text-align: center;
					font-size:14px;
					line-height: 30px;
					padding-top:5px;
				}
			}
			.table{
				width:960px;
				margin:10px 0;
				thead{
					td{
						font-size:12px;
						color:#A3A1A1;
						text-align: center;
					}
				}
			}
			.null_table{
				width:100%;
				height:95px;
				background:#ECECEC;
				color:#999;
				text-align: center;
				line-height: 95px;
			}
			.see_detail{
				width:100%;
				margin-top:20px;
				color:#A3A1A1;
				text-align: right;
				span{
					color:red;
					margin-left:5px;
				}
			}
		}
	}
</style>